<html xmlns:th="http://www.thymeleaf.org" lang="zh-cn" >
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="description" content="超级云盘" />
	<title>超级云盘</title>

	<link rel="stylesheet" href="./css/jq22.css"/>

	<link rel="stylesheet" href="/bootstrap/css/bootstrap.min.css">
	<script src="/js/jquery.min.js"></script>
	<script src="/bootstrap/js/bootstrap.min.js"></script>

</head>
<style>
	.blur {
		filter: url(blur.svg#blur); /* FireFox, Chrome, Opera */

		-webkit-filter: blur(7px); /* Chrome, Opera */
		-moz-filter: blur(7px);
		-ms-filter: blur(7px);
		filter: blur(7px);


		filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=7, MakeShadow=false); /* IE6~IE9 */
	}
	.little_title {
		font-family: '微软雅黑';
		font-size: 40px;
		color: white;
		bottom: 7%;
		position: absolute;
		margin-left:10%;
		text-shadow: rgba(128,128,128,0.5) 2px 2px;
	}
	.carousel-fade .carousel-inner .item{
		opacity:0.5;
		transition:opacity 2s;
		-webkit-transition:opacity 2s;
		-moz-transition:opacity 2s;
		-ms-transition:opacity 2s;
		-o-transition:opacity 2s;
	}
	.carousel-fade .carousel-inner .active{ opacity: 1;}
	.carousel-fade .carousel-inner .active.left,.carousel-fade .carousel-inner .active.right{left: 0;opacity: 0.5;}
	.carousel-fade .carousel-inner .next.left,
	.carousel-fade .carousel-inner .prev.right {opacity: 1;}

	a{
		cursor: pointer;
	}

</style>
<body onkeydown="enterlogin();">
<!-- begin -->
<!--<div id="topTitleMask"-->
	 <!--style="width: 100%;height:80px;background-color: rgba(128,128,128,0.8);-->
	 <!--position: absolute;"-->
	 <!--class="blur">-->
<!--</div>-->
<!--<div id="topTitle"-->
	 <!--style="width: 100%;height:80px;background-color: rgba(255,255,255,0.6);-->
	 <!--position: absolute;">-->
<!--</div>-->


<!--<div id="formbackground" class="carousel slide carousel-fade" style="position:fixed; z-index:-1;width: 100%;height:100%;" data-ride="carousel" data-interval="4000">
	<div class="carousel-inner" role="listbox">
		<div class="item active">
			<img id="pic001" src="images/bg1.jpg" style="width: 100%;height: 100%;" alt="First slide">
			<p class="little_title">
				<span>遇见好时光</span><br>
				&nbsp;&nbsp;&nbsp;<span>springboot项目超级云盘</span>
			</p>
		</div>
		<div class="item">
			<img id="pic002" src="images/bg2.jpg" style="width: 100%;height: 100%;" alt="Second slide">
			<p class="little_title">
				<span>在线上传</span><br>
				&nbsp;&nbsp;&nbsp;<span>体现下载上传超级云盘</span>
			</p>
		</div>
		<div class="item">
			<img id="pic003" src="images/bg3.jpg" style="width: 100%;height: 100%;" alt="Third slide">
			<p class="little_title">
				<span>全功能分享</span><br>
				&nbsp;&nbsp;&nbsp;<span>随时随地 随传随到</span>
			</p>
		</div>
		<div class="item">
			<img id="pic004" src="images/bg4.jpg" style="width: 100%;height: 100%;" alt="Fourth slide">
			<p class="little_title">
				<span>心有多大 梦有多大</span><br>
				&nbsp;&nbsp;&nbsp;<span>马上就到 无可阻挡</span>
			</p>
		</div>
	</div>
</div>-->

<div id="login" style="background-color: rgba(0,0,0,0);">
	<div class="wrapper">
		<div class="login" style="margin-top: 0px">
			<!--<div style="display: inline-block;width: 60%;height: 100%"></div>-->
			<form action="#" method="post" class="container offset1 loginform"
				  style="display: inline-block; float: right; margin: 95px 40px 0px 0px">
				<div id="owl-login">
					<div class="hand"></div>
					<div class="hand hand-r"></div>
					<div class="arms">
						<div class="arm"></div>
						<div class="arm arm-r"></div>
					</div>
				</div>
				<div class="pad">
					<!--<input type="hidden" name="_csrf" value="9IAtUxV2CatyxHiK2LxzOsT6wtBE6h8BpzOmk="/>-->
					<div class="control-group">
						<div class="controls">
							<label for="userName" class="glyphicon glyphicon-user"></label>
							<input id="userName" type="text" name="email" placeholder="用户名/邮箱" tabindex="1" autofocus="autofocus" class="form-control input-medium" />
						</div>
					</div>
					<div class="control-group">
						<div class="controls">
							<label for="password" class="glyphicon glyphicon-briefcase"></label>
							<input id="password" type="password" name="password" placeholder="密码" tabindex="2" class="form-control input-medium" />
						</div>
					</div>

				</div>
				<div class="form-actions">
					<a id="doSignup" tabindex="6" class="btn btn-link text-muted">注册</a>
					<button type="button" id="doLogin" tabindex="4" class="btn btn-primary">登录</button>
				</div>
			</form>

		</div>
	</div>
	<script>
        $(function() {
            // 禁用登录按钮
            document.getElementById("doLogin").disabled=true;

            $('#login #password').focus(function() {
                $('#owl-login').addClass('password');
            }).blur(function() {
                $('#owl-login').removeClass('password');
            });

            $("#forget_pw").click(function (e) {
				alert("密码忘了就没救了！")
            });

            $("#doSignup").click(function (e) {
                if(document.getElementById("doSignup").innerText=="注册") {
                    $("#userName").attr('placeholder',"请设置用户名");
                    $("#password").attr('placeholder',"请设置密码");
                    document.getElementById("doLogin").innerText="确认";
                    document.getElementById("doSignup").innerText="取消注册";
                    if($("#userName").val() != "" && $("#password").val() != ""){
                        document.getElementById("doLogin").disabled=false;
                    } else{
                        document.getElementById("doLogin").disabled=true;
                    }
                    $("#activeCodeGroup").show();

				} else{
                    $("#userName").attr('placeholder',"用户名/邮箱");
                    $("#password").attr('placeholder',"密码");
                    document.getElementById("doLogin").innerText="登录";
                    document.getElementById("doSignup").innerText="注册";
                    if($("#userName").val() != "" && $("#password").val() != ""){
                        document.getElementById("doLogin").disabled=false;
                    } else{
                        document.getElementById("doLogin").disabled=true;
                    }
                    $("#activeCodeGroup").hide();
				}
            });

			$("#userName, #password").bind('input propertychange',function (e){
                if($("#userName").val() != "" && $("#password").val() != ""){
                    document.getElementById("doLogin").disabled=false;
				} else{
                    document.getElementById("doLogin").disabled=true;
				}
			});
            //简单登录操作
            $("#doLogin").click(function (e) {
                if(document.getElementById("doLogin").innerText=="登录") {
                    $.ajax({
                        type: "POST",
                        url: "/login",
                        data: {
                            "userName": $("#userName").val(),
                            "password": $("#password").val()
                        },
                        dataType: "json",
                        success: function (data) {
                            if (data.result == "1") {
                                window.location.href = "/";
                            } else if (data.result == "2") {
                                alert("密码错误！");
                            } else {
                                alert("用户不存在或账号密码不能为空！");
                            }
                        }
                    });
                }
                else {
                    if($("#activeCode").val()==""){alert("请填写激活码！");return;}
                    $.ajax({
                        type: "POST",
                        url: "/signin",
                        data: {
                            "userName": $("#userName").val(),
                            "password": $("#password").val(),
							"regcode" : $("#activeCode").val()
                        },
                        dataType: "json",
                        success: function (data) {
                            if (data.result == "1") {
                                alert("注册成功，请重新登录！");
                                window.location.href = '/';
                            } else if (data.result == "0"){
                                alert("用户已经存在，请登录或换一个用户名！");
                            } else {alert("注册失败，激活码不正确！");}
                        }
                    });
				}
            });
        });
        //回车登录
        function enterlogin(){
            if (event.keyCode == 13){
                event.returnValue=false;
                event.cancel = true;
                if($("#userName").val() != "" && $("#password").val() != "") {
                    $("#doLogin").click();
                }
            }
        }
	</script>
</div>


<!-- end -->
</body>
</html>
